<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录注册</title>
</head>
<style>
.bigbox{
    display: flex;
    width: 400px;
    height: 600px;
    margin: auto;
    background-color: darkgray;
}
.box1{
    width: 300px;
    height: 30px;
    margin-top: 100px;
    margin-left: 50px;
    background-color: bisque;
   
}
.box2{
    width: 300px;
    height: 30px;
    margin-top: 150px;
    margin-left: -300px;
    background-color: bisque;
   
}
.input{
    width: 300px;
    height: 30px;
}
.box3{
    width: 300px;
    height: 30px;
    margin-top: 200px;
    margin-left: -300px;
    background-color: bisque;
}
.denglu{
    width: 300px;
    height: 30px;
}
.box4{
    width: 300px;
    height: 30px;
    margin-top: 235px;
    margin-left: -300px;
    background-color: bisque;
}

</style>
<body>
    <div class="bigbox">
        <div class="box1">
            <input type="text" class="input" id="dlsrk" placeholder="请输入账号" >
        </div>
        <div class="box2">
            <input type="password" class="input" id="dlmmk" placeholder="请输入密码">
        </div>
        <div class="box3">
            <button class="denglu" onclick="dl()">登录</button>
        </div>
        <div class="box4">
            <button class="denglu" onclick="zc()">注册</button>
        </div>
        </div>
    </div>

    <script>
         function dl(){
             dataDisplay=localStorage.getItem('zhanghao');
            if(dlsrk.value=='111' && dlmmk.value=="0802"){
                alert("登录成功");
            window.location.href = "https://www.mi.com";
            }
            else{
                alert("账号或密码错误，登录失败");
            }
         
        }
           function zc(){
                window.location.href = "注册页面.html";
            }
    </script>
</body>
</html>